﻿@using System.ComponentModel
@using System.ComponentModel.DataAnnotations;

@page "/admin/login"
@layout LoginLayout

@inject HttpClient Http
@inject IJSRuntime JSRuntime
@inject NavigationManager navigationManager
@inject MessageService _message



<style>
    @*#app{height:100%!important;}*@.login-container {
        height: 100%;
        background-color: #ccc;
    }

    .login-row {
        padding-top: 12%;
    }

    .login-col {
        padding: 5px;
        background-color: #fff;
        border-radius: 8px;
        box-shadow: 0 3px 18px rgba(64, 169, 255, 0.5);
    }

    .login-form {
        margin: 25px 20px;
    }

    .login-logo {
        text-align: center;
        padding-bottom: 10px;
    }
</style>


<div class="login-container">
    <Row class="login-row" Justify="space-around" Align="middle">
        <Col class="login-col" Xs="20" Sm="15" Md="10" Lg="8" Xl="7">
        <Form class="login-form" Model="@model" LabelColSpan="8" WrapperColSpan="16" OnFinish="OnFinish"
            OnFinishFailed="OnFinishFailed">
            <div class="login-logo">
                <img src="image/login.png" height="60">
            </div>
            <FormItem Label="用户名">
                <Input @bind-Value="@context.Username" />
            </FormItem>
            <FormItem Label="密码">
                <InputPassword @bind-Value="@context.Password" />
            </FormItem>

            <FormItem WrapperColOffset="8" WrapperColSpan="16">
                <Button Type="@ButtonType.Primary" HtmlType="submit">
                    登录
                </Button>
            </FormItem>
        </Form>
        </Col>
    </Row>
</div>


@code
{
    public class RespData<T> where T : new()
    {
        public int Code { get; set; }
        public string Msg { get; set; }
        public T Data { get; set; } = new T();
        public string Token { get; set; }
    }

    public class User
    {
        [DisplayName("用户名")]
        [Required(ErrorMessage = "请输入用户名")]
        [MaxLength(12, ErrorMessage = "用户名不超过12个字符")]
        public string Username { get; set; } = "";

        [DisplayName("密码")]
        [Required(ErrorMessage = "请输入密码")]
        [MinLength(6, ErrorMessage = "密码不少于6个字符")]
        [MaxLength(20, ErrorMessage = "密码不超过20个字符")]
        public string Password { get; set; } = "";
    }

    public class UserDto
    {
        public int Id { get; set; }
        public string Username { get; set; }
    }

    private User model = new User();

    /// <summary>
    /// 表单提交、登录
    /// </summary>
    /// <param name="editContext"></param>
    private async Task OnFinish(EditContext editContext)
    {
        var response = await Http.PostAsJsonAsync("/api/login", model);
        var resData = await response.Content.ReadFromJsonAsync<RespData<UserDto>>();
        if (resData != null && resData.Token != null)
        {
            LocalStorageHelper localStorageHelper = new LocalStorageHelper(JSRuntime);
            await localStorageHelper.SetLocalStorage("token", resData.Token);
            _message.Success("登录成功");
            navigationManager.NavigateTo("/admin/", false);
        }
        else
        {
            if (string.IsNullOrEmpty(resData.Msg))
            {
                _message.Error(resData.Msg);
            }
            else
            {
                _message.Error("登录失败");
            }
        }
    }

    private void OnFinishFailed(EditContext editContext)
    {

    }
}
